

<script>
import myInput from "@/components/my-input";
import myButton from "@/components/my-button";
export default {
  name: "factory",
  data() {
    return {
      elements: []
    };
  },
  components: {
    myInput,
    myButton
  },
  render: function(createElement) {
    return createElement(
      "div",
      Array.apply(null, { length: 20 }).map(function() {
        return createElement("button",{
          domProps:{
            innerHTML:"Click!"
            },
          on:{
            click: () =>{
              console.log("!")
            }
          }
        });
      })
    );
  },
   mounted() {
    this.$axios.get("/static/data.json").then(response => {
      this.elements = response.data;
    });
  }
};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style lang="less">
.loginForm {
  margin: 50% auto;
  overflow: hidden;
  .myInput {
    margin-bottom: 10px;
  }
  .myButton {
    width: 100%;
    color: #ffffff;
    background: #59f;
    border: #59f;
  }
}
</style>